<template>
	<view>
		<view class="wenzhang_top">
			<view class="wenzhang_top_left">
				
			</view>
			<view class="wenzhang_top_txt">
				文章类型
			</view>
		</view>
		<picker  @change="bindPickerChange" :range="array" class="storeBox" range-key="name">
			
			<text class="storeName">请选择文章类型</text>
			
			<label class="" v-if="array[index]" style="font-size: 28rpx;padding-left: 45rpx;">{{array[index].name}}</label>
			<image class="goIcon" style="" src="/static/user2/rightjt.png"></image>
		</picker>
		<view class="jianju">
			
		</view>
		<view class="neirong">
			<input type="text" v-model="input_title" placeholder="文章标题不超过50个字符!" class="input_title" maxlength="50" />
		</view>
		<jinEdit placeholder="请输入文章内容" showImgToolbar="true" @editOk="editOk" uploadFileUrl="http://xjk.minshangkeji.com/index.php/api/upload/single"></jinEdit> 
	</view>
</template>

<script>
	import Require from '@/common/require.js';
	import pickRegions from '@/components/pick-regions/pick-regions.vue';
	import jinEdit from '@/components/jin-edit/jin-edit.vue';
	export default {
		components: {
			pickRegions, 
			jinEdit,
		},
		data() {
			return {
				array:[],
				index:'',
				input_title:''
			};
		},
		onLoad() {
			var self=this
			self.two_pid()
		},
		methods:{
			editOk(res) {
			    console.log(res);
			},
			two_pid: function() {
				var self = this;
				Require.commonRequest({
					url: '/api/store/classify',
					success: function(ret) {
						if (ret.data.code == 200)
							self.array = ret.data.data
					},
					fail: function() {
						uni.showToast({
							icon: "none",
							title: "网络异常，请稍后再试"
						})
					}
				})
			},
			// 类目事件
			bindPickerChange: function(e) {
				var self = this
				console.log(e.target)
				self.index = e.target.value //将数组改变索引赋给定义的index变量
				let jg = self.array[self.index] //将array【改变索引】的值赋给定义的jg变量
			},
		}
	}
</script>

<style lang="scss">
	page{
	}
.wenzhang_top{
	width: 750rpx;
	height: 90rpx;
	background-color: #EFEFF4;
	padding: 30rpx;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	.wenzhang_top_left{
		width:10rpx;
		height:30rpx;
		background:rgba(115,33,215,1);
		border-radius:5rpx;
	}
	.wenzhang_top_txt{
		font-size:32rpx;
		font-family:PingFang SC;
		font-weight:400;
		color:rgba(45,45,45,1);
		margin-left: 12rpx;
	}
}
.storeBox{
	width: 750rpx;
	height: 100rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 30rpx;
	box-sizing: border-box;
}
.goIcon{
	width: 14rpx;
	height: 22rpx;
	
}
.storeName{
	font-size:30rpx;
	font-family:PingFang SC;
	font-weight:400;
	color:rgba(141,141,141,1);
}
.neirong{
	width: 750rpx;
	padding: 40rpx 30rpx ;
	box-sizing: border-box;
}
.jianju{
	width: 750rpx;
	height: 30rpx;
	background-color: #EFEFF4;
}
.input_title{
	font-size: 32rpx;
	border-bottom: 1rpx solid #E5E5E5;
	height: 100rpx;
}
</style>
